<template>
	<view class="addTopicAll">
		<view class="topicInput">
			<input class="uni-input" focus placeholder="输入你想讨论的话题" />
		</view>
		<view class="content">
			<textarea cols="30" rows="10" placeholder="聊聊你的看法吧~(非必填)" auto-height></textarea>
		</view>

		<!-- 跳转到测试调用手机摄像头 -->
		<view class="image">
			<text class="imCon">+</text>
		</view>
		<!-- 添加标签 -->
		<view class="addTag">
			<view>
				<text style="color: rgb(212, 212, 212);margin-right: 15rpx;font-size: 24rpx;">#</text>
				<text style="font-size: 24rpx;color: rgb(66, 66, 66);">添加标签</text>
			</view>
			<uni-icons type="forward" size="20" style="color: rgb(205, 205, 205);"></uni-icons>
		</view>
		<button class="btn">发起</button>
		<text @click="jumpHandle">跳转</text>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			jumpHandle() {
				uni.navigateTo({
					url: '/pages/camera/camera'
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.addTopicAll {
		padding: 20rpx;
		// background-color: #fff;

		.topicInput {
			width: 100%;
			height: 65rpx;
			line-height: 30rpx;
			border-bottom: 5rpx solid rgb(247, 247, 247);
		}

		.content {
			height: 300rpx;

		}

		.image {
			width: 150rpx;
			height: 150rpx;
			border-radius: 25%;
			background-color: rgb(204, 204, 204);
			
			.imCon{
				font-size: 86rpx;
				position: absolute;
				top: 33%;
				left: 9%;
				color: rgb(219, 219, 219);
			}
		}
		
		.addTag{
			display: flex;
			justify-content: space-between;
			margin-top: 30rpx;
		}
		.btn {
            position: absolute;
            text-align: center;
            bottom: 0;
            font-size: 16px;
            color: #FFFFFF;
            margin: 25px 0;
            width: 735rpx;
            height: 95rpx;
            line-height: 95rpx;
            background: #E0E0E0;
            border-radius: 32%;
            background-color: rgb(21, 194, 188);
            left: 50%;
            transform: translateX(-50%);
        }
	}
</style>